/**
 * for every html
 */

// 当前图片索引
let swiperIndex = 0;
// 轮播用图片
const swiperItems = document.querySelectorAll('header .swiper-item');
const itemLength = swiperItems.length;
// 上一张按钮
const prevBtn = document.querySelector('header .swiper-button-prev');
prevBtn.addEventListener('click', setPrev)
// 下一张按钮
const nextBtn = document.querySelector('header .swiper-button-next');
nextBtn.addEventListener('click', setNext)


// 切换上一张
function setPrev() {
    if (swiperIndex <= 0) swiperIndex = itemLength - 1;
    else swiperIndex--;
    showImg(swiperIndex);
}

// 切换下一张
function setNext() {
    if (swiperIndex >= itemLength - 1) swiperIndex = 0;
    else swiperIndex++;
    showImg(swiperIndex);
}

// 显示索引的图片
function showImg(index) {
    // 全部隐藏
    for (let i = 0; i < itemLength; i++)
        swiperItems[i].classList.remove('show');
    // 单独显示
    swiperItems[index].classList.add('show');
}

// 自动轮播
setInterval(function () {
    setNext();
}, 2000);